.container {}

.nav-box {
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	transition: all 0.3s;
}

.nav-box .nav-item {
	width: 100%;
	height: 44px;
}

.nav-box .nav-item .search {
	margin-left: 30rpx;
	width: 240rpx;
	height: 34px;
	border-radius: 34px;
	color: #999;
	font-size: 24rpx;
	font-weight: bold;
	transition: all 0.3s;
}

.search image {
	margin: 0 10rpx 0 20rpx;
	width: 32rpx;
	height: 32rpx;
}

.put-box {
	width: 100%;
	background: #101010;
	height: 360rpx;
	padding-bottom: 20rpx;
	overflow-x: auto;
}

.put-box .put-item {
	padding: 0 22rpx;
}

.put-box .put-item .put-view {
	flex-shrink: 0;
	margin: 8rpx;
	padding: 0 20rpx;
	height: 100rpx;
	border-radius: 8rpx;
	justify-content: center;
}

.put-view .cu-img-group {
	margin-left: 10rpx;
	direction: ltr;
	unicode-bidi: bidi-override;
	display: inline-block;
}

.cu-img-group .cu-img {
	width: 52rpx;
	height: 52rpx;
	border-radius: 52rpx;
	display: inline-flex;
	position: relative;
	margin-left: -10rpx;
	border-style: solid;
	border-width: 4rpx;
	border-color: #212121;
	background: #313131;
	vertical-align: middle;
}

.cu-img-group .cu-img image {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #313131;
}

.cu-img-group .cu-item {
	padding: 0 15rpx;
	width: auto !important;
	height: 52rpx;
	line-height: 52rpx;
	text-align: center;
	color: #999;
	font-size: 18rpx;
}

.cu-img-group .cu-active {
	height: 48rpx;
	line-height: 48rpx;
	background: #212121;
	color: #FFA676;
}

.put-view .cu-name {
	margin-left: 15rpx;
	font-size: 26rpx;
	font-weight: bold;
}

.content {
	margin: 60rpx 30rpx 0;
	width: calc(100% - 60rpx);
}